/*
    postCss的配置文件

    postCss是基于node.js运行的一个处理css的工具
    所以它的配置是用nodejs的方式
*/

// postCss导出一个对象
module.exports = {
  // 配置相关的插件
  plugins: {
    // 自动添加不同浏览器厂商的声明前缀，用来兼容不同的的浏览器
    // vue-cli已经在内部默认配置了autoprefixer，再次添加会报警告
    //   autoprefixer: {
    // browsers用来配置要兼容到的系统（浏览器）环境
    // vue-cli配置环境的文件是 .browserslistrc
    // 两者发生冲突，要将这个browsers配置到对应的文件中去
    // browsers: ['Android >= 4.0', 'iOS >= 8'],
    //   },
    // 把px转换为 rem
    'postcss-pxtorem': {
      // 转换的根元素基准值
      // 正常按照设计稿来，750宽的设计，写750 / 10 = 75
      // vant组件库 是按照 375宽 写的
      // 移动端一般一iPhone6/7/8（375宽度）为原型设计的
      // 设计稿是基于750宽设计的,，则准值设置为75
      // 准值正确的话，根据设计图片测是多少px，就写多少px
      // vant的样式就会不匹配，会变成原来的一半，所还是设置为37.5
      // 在写px的时候写成原来的一半px即可
      rootValue: 37.5,
      // 需要转换的css属性
      propList: ['*']
      // propList: ['font-size']  指定只转换font-size属性的px
    }
  }
}
